import router, { resetRouter } from "./router";
import store from "./store";
const allowList = ["/login", "/404"];
const notFount = { path: "*", redirect: "/404" };
router.beforeEach((to, from, next) => {
    const token = localStorage.getItem("ACCESS_TOKEN");
    if (token) {
        if (to.path === "/login") {
            next("/");
        } else {
            const { roles, menus } = store.state.user;
            const { addRoutes } = store.state.permission;
            console.log(menus, "menus-----");
            console.log(addRoutes, "addRoutes-----------");
            /**
             *  持久化处理和过滤路由相冲突了
             *  不使用vuex持久化，只需从vuex中判断是否有menus即可，页面刷新vuex数据丢失，重新走接口判断menus即可
             *  使用持久化处理后，造成的问题：页面刷新vuex中的数据被保存在本地，而路由中的数据由于刷新已经丢失，需要再次重置添加，那么从vuex中判断menus是否存在就不对了，因为menus早就持久化存储了，造成路由为空，页面白屏
             * 冲突点：第一次进来时需要过滤路由，页面刷新时需要再次过滤路由，如何判断手动刷新了页面？
             * 通过添加window.onbeforeunload事件监听刷新页面，然后在路由守卫中判断是否有IS_RELOAD，如果有则重新过滤路由，否则直接进入页面
             */
            if (menus.length) {
                // if (addRoutes.length) {

                // 已经登录过，如果刷新了页面则重新过滤路由
                const isReload = localStorage.getItem("IS_RELOAD");
                if (isReload) {
                    // 如果刷新了页面，则重新过滤路由
                    localStorage.removeItem("IS_RELOAD");
                    store
                        .dispatch("generateRoutes", roles)
                        .then((accessedRoutes) => {
                            resetRouter(); // 重置路由
                            // const { addRouters } = store.state.permission;
                            // router.addRoutes(addRouters); // 添加动态路由
                            accessedRoutes.push(notFount); // 放在最后添加404页面
                            console.log(
                                accessedRoutes,
                                "过滤出的动态路由-----"
                            );
                            router.addRoutes(accessedRoutes); // 添加动态路由
                            next({ ...to, replace: true });
                        });
                } else {
                    // 未刷新页面，直接进入
                    next();
                }
            } else {
                // 未登录，第一次过滤路由
                store
                    .dispatch("generateRoutes", roles)
                    .then((accessedRoutes) => {
                        resetRouter(); // 重置路由
                        accessedRoutes.push(notFount);
                        router.addRoutes(accessedRoutes); // 添加动态路由
                        next({ ...to, replace: true });
                    });
            }
        }
    } else {
        if (allowList.includes(to.path)) {
            next();
        } else {
            next("/login");
        }
    }
});
